import type { FC } from 'react';
import styles from './styles.module.less';

type LoadingProps = {
  size?: number;
}

const items = Array.from({ length: 3 });

const Loading: FC<LoadingProps> = (props) => {
  const { size = 4 } = props;

  return (
    <div className={styles.loading}>
      {items.map((_, i) => {
        const isLast = i + 1 === items.length
        return (
          <span
            key={i}
            style={{
              width: size,
              height: size,
              marginRight: isLast ? 0 : size
            }}
          />
        );
      })}
    </div>
  );
}

export default Loading;